網絡正在走向移動。據 Statista 稱,全球 51% 的網頁瀏覽量來自移動設備。在亞洲和非洲等一些地區,這一比例要高得多。在每種情況下,這個百分比都在逐年穩步增長。
主要搜索引擎都意識到了這一趨勢,這就是為什么他們優先考慮具有快速移動加載時間的網站。移動用戶可能帶寬有限,但仍希望快速查找信息。這些用戶往往缺乏耐心,這意味著加載緩慢的網站的跳出率很高。(“跳出率”是僅查看一個頁面后離開網站的網站訪問者的百分比)。
谷歌和其他網站速度權威機構已經確定移動網站的最長加載時間應該在三秒左右。三秒后,用戶留存率急劇下降。搜索引擎將“懲罰”加載緩慢的網站,將它們放在搜索結果中的更靠后的位置,尤其是對于移動用戶。
移動連接上的三秒加載時間限制并不是很寬容,但有一些經過驗證的真實策略可以降低移動加載時間。
如何提高移動性能
有許多因素會影響移動性能,因此許多策略和最佳實踐可以縮短加載時間。
最小化文件大小和文件數
為了確保更快的加載時間,所有網站文件都應盡可能小。圖像通常是請求的最大文件,可以通過使用圖像優化器或將它們轉換為輕量級圖像格式(如 SVG)來縮小這些文件。
HTML、JavaScript 和 CSS 文件也可以通過縮小來縮小。代碼縮小意味著從代碼中去除所有的空白和注釋,并以最緊湊的方式對其進行重組。這會將文件大小減少到最低限度。雖然這使得代碼對人類來說實際上是不可讀的,但網絡瀏覽器仍然能夠很好地執行代碼。
除了創建更小的文件大小外,整體文件的數量應保持在最低限度。加載網站所需的每個額外文件都意味著額外的請求和響應,這些往返行程會增加加載時間。具有多個 JavaScript 和 CSS 文件的站點應該將所有 JavaScript 代碼合并到一個文件中,CSS 也是如此。對于需要很少 JavaScript 或 CSS 的頁面,使用內聯樣式* 可以顯著縮短加載時間。
*通常,Web 開發人員在不同的文件中編寫 HTML、JavaScript 和 CSS 代碼。使用一種稱為“內聯樣式”的技術,開發人員可以將他們的 JavaScript 和/或 CSS 代碼寫在與他們的 HTML 相同的文件中。
在邊緣緩存資源
通常,當用戶訪問網站時,用戶的設備必須與網絡服務器通信以獲取網站文件。如果 Web 服務器在舊金山,而用戶在伯克利(10 英里外),這應該很快。但是如果用戶在東京(5,000 英里外)呢?這意味著每個請求和響應都必須傳輸數千英里,從而大大延遲了網站加載。
緩解此問題的常用方法是利用內容交付網絡 (CDN)。全球 CDN在網絡邊緣緩存內容。這意味著 CDN 擁有遍布全球的數據中心的緩存服務器。任何可以訪問 Internet 的人都不會離數據中心太遠。這些數據中心服務器可以與原始 Web 服務器通信以緩存網站數據,以便訪問使用 CDN 的網站的用戶可以從其本地數據中心獲取網站文件。這確保了用戶的快速請求響應時間,無論他們身在何處。
緩存 API 調用
API 調用是從外部資源獲取數據的HTTP請求。例如,像爛番茄這樣的電影評論網站可能會對像 Fandango 這樣的票務服務進行 API 調用,以便瀏覽爛番茄的用戶可以看到本地電影放映時間。雖然 API 調用可以幫助創建強大的體驗并減少冗余工作,但它們也會創建新的 HTTP 請求,這會減慢加載時間。
可以緩存 API 調用以最小化這些額外的 HTTP 請求。在我們上面的電影放映時間示例中,爛番茄每天只需要獲取一次洛杉磯電影放映時間。他們可以將其站點配置為每天緩存一次此 API 調用。這樣,如果每天有 10,000 名洛杉磯用戶訪問 Rotten Tomatoes,那么只有第一個用戶需要等待對 Fandango 的 API 調用。
優先考慮可見內容
用戶在加載網頁時立即看到的往往只是冰山一角;他們必須向下滾動才能看到頁面的其余部分。在發生任何滾動之前出現在用戶屏幕上的內容稱為“首屏”內容。Web 開發人員應該以始終首先加載首屏內容的方式編寫代碼。實現此目的的一種技術稱為延遲加載,它通過在用戶向下滾動頁面時動態加載首屏內容來工作。
避免重定向
由于各種原因,一些網站會在頁面加載時創建重定向。例如,301 重定向通常用于重命名或重新命名的網站。應盡可能避免這種做法,因為重定向會消耗寶貴的加載時間。
概括
隨著移動瀏覽接管網絡,擁有一個高性能的移動網站變得越來越重要。快速的移動網站會獲得更高的參與度和更高的轉化率,以及 SEO 提升。網站所有者應實施上述部分或全部策略以獲得這些好處。